import React, {Component} from 'react'
import Taro from '@tarojs/taro'
import {View,Image} from '@tarojs/components'

import './index.scss'
import {getActList} from "../../service/active";

type PageStateProps = {}

type PageDispatchProps = {}

type PageOwnProps = {}

type PageState = {
  TableList: []
}

type IProps = PageStateProps & PageDispatchProps & PageOwnProps

interface Index {
  props: IProps;
}


class Index extends Component<IProps, PageState> {
  constructor(props: IProps) {
    super(props);
    this.state = {
      TableList: []
    }
  }


  componentWillMount() {

  }

  componentDidMount() {
    this.loadData()
  }

  loadData(){
    this.getActList()
  }
  async getActList() {
    const res =await getActList()
    this.setState({
      TableList: res.data
    })
  }

  handleNavTo(id) {
    Taro.navigateTo({
      url: `/pages/active-detail/index?id=${id}`
    })
  }

  render() {
    const {TableList} = this.state
    return (
      <View className='active_container'>
        <View className='activeList'>
          {
            TableList.map((item:any)=>{
              return (
                <View className='activeList_item' onClick={this.handleNavTo.bind(this,item.id)}>
                  <Image className='backImg' src={item.act_pic} />
                </View>
              )
            })
          }
        </View>
      </View>
    )
  }
}

export default Index
